<template>
  <div id="app">
    <h1>代码实训</h1>
    <hr />
    <code1></code1>
    <hr />
    <code2></code2>
    <hr />
    <code3></code3>
    <hr />
    <code4></code4>
    <hr />
    <code5></code5>
    <hr />
    <code6></code6>
    <hr />
    <code7></code7>
    <hr />
    <code8></code8>
    <hr />
    <code9></code9>
  </div>
</template>

<script>
import code1 from "./components/code1.vue";
import code2 from "./components/code2.vue";
import code3 from "./components/code3.vue";
import code4 from "./components/code4.vue";
import code5 from "./components/code5.vue";
import code6 from "./components/code6.vue";
import code7 from "./components/code7.vue";
import code8 from "./components/code8.vue";
import code9 from "./components/code9.vue";
export default {
  components: {
    code1,
    code2,
    code3,
    code4,
    code5,
    code6,
    code7,
    code8,
    code9,
  },
};
</script>

<style>
#app {
  margin: 0 auto;
  margin-bottom: 200px;
}
</style>
